@extends('Admin.layout.layout')
@section('content')
    <style>
        .centerbtn{float:right;position: relative;top:-34px;}
        .btn-xs{
            margin:0 5px;
        }
    </style>
    <div class="wrapper wrapper-content animated fadeInRight">

        <h3>文章分类管理</h3>
        <div class="row">
            <div class="col-sm-4" style="width:100%;">
                <div id="nestable-menu">
                    <button type="button" data-action="expand-all" class="btn btn-white btn-sm">展开</button>
                    <button type="button" data-action="collapse-all" class="btn btn-white btn-sm">收起</button>
                    <a href="" class="btn btn-sm btn-success "><i class="fa fa-refresh"></i> 刷新</a>

                    <a class="btn btn-sm btn-primary"  href="/foradmin/article/category/create">新增</a>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6" style="width:100%;">
                <div class="ibox ">
                    <div class="ibox-content">
                        <div class="dd" id="nestable">
                            <ol class="dd-list">
                                @if(!empty($index_tree))
                                    <?php $STATUS = ['1' => '启用', '0' => '禁用']; ?>
                                    @foreach ($index_tree as $c1)
                                        <li class="dd-item" data-id="{{$c1['id']}}">
                                            <div class="dd-handle">
                                                {{$c1['id']}} - {{$c1['title']}}
                                            </div>
                                            <td class="center">
                                                <span class="centerbtn">
                                                {{array_get($STATUS, $c1['is_show'] )}}：
                                                    <img class="status_show setShow" title="点击禁用" @if(array_get($c1, 'is_show') == 0) style="display: none;" @endif src="{{asset('img/start.png')}}"  data-show='0' data-id='{{array_get($c1, 'cate_id')}}' alt="">

                                                    <img class="status_hide setShow" title="点击启用"@if(array_get($c1, 'is_show') == 1) style="display: none;" @endif src="{{asset('img/close.png')}}"  data-show='1' data-id='{{array_get($c1, 'cate_id')}}'>
                                                </span>
                                                <a class="btn btn-xs btn-warning centerbtn" href="/foradmin/article/category/{{$c1['cate_id']}}/edit">编辑</a>
                                                <a class="btn btn-xs btn-danger centerbtn"
                                                        data-url="{{URL::to('foradmin/article/category/'.$c1['cate_id'])}}"
                                                        data-toggle="modal"
                                                        data-target="#delete-modal"
                                                >
                                                    删除
                                                </a>
                                            </td>
                                            <ol class="dd-list">
                                                @if(isset($c1['children']))
                                                    @foreach ($c1['children'] as $c2)
                                                        <li class="dd-item" data-id="{{$c2['id']}}">
                                                            <div class="dd-handle">
                                                                {{$c2['id']}} - {{$c2['title']}}
                                                            </div>
                                                            <td class="center">
                                                                <span class="centerbtn">
                                                                {{array_get($STATUS, $c2['is_show'] )}}：
                                                                    <img class="status_show setShow" title="点击禁用" @if(array_get($c2, 'is_show') == 0) style="display: none;" @endif src="{{asset('img/start.png')}}"  data-show='0' data-id='{{array_get($c2, 'cate_id')}}' alt="">

                                                                    <img class="status_hide setShow" title="点击启用"@if(array_get($c2, 'is_show') == 1) style="display: none;" @endif src="{{asset('img/close.png')}}"  data-show='1' data-id='{{array_get($c2, 'cate_id')}}'>
                                                                </span>
                                                                <a class="btn btn-xs btn-warning centerbtn" href="/foradmin/article/category/{{$c2['cate_id']}}/edit">编辑</a>
                                                                <a class="btn btn-xs btn-danger centerbtn"
                                                                   data-url="{{URL::to('foradmin/article/category/'.$c2['cate_id'])}}"
                                                                   data-toggle="modal"
                                                                   data-target="#delete-modal"
                                                                >
                                                                    删除
                                                                </a>
                                                            </td>
                                                            <ol class="dd-list">
                                                                @if(isset($c2['children']))
                                                                    @foreach ($c2['children'] as $c3)
                                                                        <li class="dd-item" data-id="{{$c3['id']}}">
                                                                            <div class="dd-handle">
                                                                                {{$c3['id']}} - {{$c3['title']}}
                                                                            </div>
                                                                            <td class="center">
                                                                                <span class="centerbtn">
                                                                                {{array_get($STATUS, $c3['is_show'] )}}：
                                                                                    <img class="status_show setShow" title="点击禁用" @if(array_get($c3, 'is_show') == 0) style="display: none;" @endif src="{{asset('img/start.png')}}"  data-show='0' data-id='{{array_get($c3, 'cate_id')}}' alt="">

                                                                                    <img class="status_hide setShow" title="点击启用"@if(array_get($c3, 'is_show') == 1) style="display: none;" @endif src="{{asset('img/close.png')}}"  data-show='1' data-id='{{array_get($c3, 'cate_id')}}'>
                                                                                </span>
                                                                                <a class="btn btn-xs btn-warning centerbtn" href="/foradmin/article/category/{{$c3['cate_id']}}/edit">编辑</a>
                                                                                <a class="btn btn-xs btn-danger centerbtn"
                                                                                   data-url="{{URL::to('foradmin/article/category/'.$c3['cate_id'])}}"
                                                                                   data-toggle="modal"
                                                                                   data-target="#delete-modal"
                                                                                >
                                                                                    删除
                                                                                </a>
                                                                            </td>
                                                                        </li>
                                                                    @endforeach
                                                                @endif
                                                            </ol>
                                                        </li>
                                                    @endforeach
                                                @endif
                                            </ol>
                                        </li>
                                    @endforeach
                                @endif
                            </ol>
                        </div>
                        <div class="row">

                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="ibox ">
                    <div class="dd" id="nestable2">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Nestable List -->
    <script src="{{asset('js/plugins/nestable/jquery.nestable.js')}}"></script>
    <script src="{{asset('js/plugins/validate/jquery.validate.min.js')}}"></script>
    <script src="{{asset('js/plugins/validate/messages_zh.min.js')}}"></script>
    <script src="{{asset('js/plugins/layer/layer.min.js')}}"></script>
    <script>
        $(document).ready(function () {
            $(document).on("click",".setShow",function(){
                var is_show = $(this).attr('data-show');
                var id =  $(this).attr('data-id');
                var _token = '{{csrf_token()}}';
                $.ajax({
                    url : '/foradmin/article/category/setShow/'+id,
                    type : 'POST',
                    dataType : "json",
                    data : {is_show:is_show,_token:_token},
                    success : function(data) {
                        if (0 == data.code) {
                            layer.alert('设置成功！', {
                                icon: 1
                            }, function () {
                                location.href = "/foradmin/article/category";
                            });
                        } else {
                            layer.alert(data.message, {
                                icon: 2
                            });
                        }
                    }
                });

            });
            var updateOutput = function (e) {
                var list = e.length ? e : $(e.target),
                        output = list.data('output');
                if (window.JSON) {
                    output.val(window.JSON.stringify(list.nestable('serialize'))); //, null, 2));
                } else {
                    output.val('浏览器不支持');
                }
            };
            // activate Nestable for list 1
            $('#nestable').nestable({
                group: 1
            }).on('change', updateOutput);

            // activate Nestable for list 2
            $('#nestable2').nestable({
                group: 1
            }).on('change', updateOutput);

            // output initial serialised data
            updateOutput($('#nestable').data('output', $('#nestable-output')));
            updateOutput($('#nestable2').data('output', $('#nestable2-output')));

            $('#nestable-menu').on('click', function (e) {
                var target = $(e.target),
                        action = target.data('action');
                if (action === 'expand-all') {
                    $('.dd').nestable('expandAll');
                }
                if (action === 'collapse-all') {
                    $('.dd').nestable('collapseAll');
                }
            });
        });
    </script>
@endsection

@section("after.js")
    @include('Admin.components.modal.delete',['title'=>'操作提示','content'=>'你确定要删除这个文章分类吗?'])
@endsection